Milk Theme for phpBB 3.1

Installation & Configuration documentation

Thanks for buying the Milk Theme - we think you made a great choice. This documentation should cover everything you need to install and configure the Theme for your forum. If you need any extra help, find a bug, or would like to submit a feature request, please feel free to contact us - we're very friendly :)

- PlanetStyles Team

How to Install Milk Theme #back to top

Setup Information

The Milk Theme requires our free FlightDeck Extension in order to configure the theme options (included in download). Therefore there are 2 parts to the installation process:

Install & enable the required extension ("FlightDeck")
Install & enable the Milk Theme

Note: We offer an affordable installation service for customers wanting help installing the Milk Theme. Email missioncontrol@planetstyles.net for more info.

How to install the FlightDeck extension

Uploading the extension files

Download Milk Theme
Locate folder "milk.zip" and extract to your desktop
Open folder "2. Extension Files"
Using either FTP or a File Manager, upload the "planetstyles" folder to: /yourdomain.com/phpBB/ext/

Enabling the extension

Navigate to: ACP (Admin Control Panel) → "Customise" (tab)
Below "Disabled Extensions", locate: "PlanetStyles Flight Deck"
Click "Enable" and confirm
Important: Browse to ACP Home and click "Run Now" next to "Purge Cache". (This is necessary to allow colour picker to function correctly).

How to install the Milk Theme

Uploading the Theme Files

Download Milk Theme
Locate folder "milk.zip" and extract to your desktop
Open folder "1. Theme Files"
Using either FTP or a File Manager, upload the "milk" folder to: /yourdomain.com/phpBB/styles/

Enabling the Theme

Navigate to: ACP (Admin Control Panel) → "Customise" (tab)
In the left sidebar, click "Install Styles"
Locate: "Milk"
Click "Install style" and confirm

Set Milk as default style

Navigate to: ACP (Admin Control Panel) → "General" (tab)
In the left sidebar, click "Board Settings"
Change "Default Style" to "Milk"
Navigate to: ACP (Admin Control Panel) → Customise (tab)
In the left sidebar, click "Styles"
Optional: Deactivate any other styles to move existing users on other styles onto the Milk Theme

Configuring Theme Options #back to top

The following sections outline the configurable options in the Milk Theme.

All options are configured in: ACP (Admin Panel) → Extensions (tab) → Flight Deck (Control Panel) → Theme Settings

Logo settings #back to top

Uploading a logo - #back to top

Open FlightDeck Extension (Control Panel)
Next to "Logo image upload" , click "Browse"
Select your logo file from your computer
If changing a logo, ensure the "logo location" filed is empty
Optional: Enter height and width
Tip: Set the height & width to 50% of your logo's actual size to ensure a crisp display on retina devices.
Click Submit

Revert to the default logo - #back to top

Open FlightDeck Extension (Control Panel)
Empty the value from the "Logo location" field
Click Submit

Removing the logo - #back to top

Open FlightDeck Extension (Control Panel)
Set "Header Structure" option to "Text Only"
Click Submit

Header settings #back to top

Uploading a header - #back to top

Open FlightDeck Extension (Control Panel)
Next to "Header background upload" , click "Browse"
Select your header image file from your computer
If changing a header, ensure the "header location" filed is empty
Optional: Set background size / position / repeat properties in the options below.
Click Submit

Header Size / Repeat / Position Options - #back to top

These Options can be found by scrolling down, under "Style Options"

Background Repeat: Defines which direction the background image repeats. Options:
- repeat-x: left &right
- repeat-y: up & down
- repeat: left & right & up & down
- no-repeat: Header doesn't repeat
Background Position: Defines the background image's starting position.
Header Tint: Applies a transparent dark layer over the header background. Useful for bright backgrounds.
Stretch header to fill space? : If using a non-repeating background, this option can be used for stretching the background image to fill the header space.

Revert to the default header (theme accent colour) - #back to top

Open FlightDeck Extension (Control Panel)
Empty the value from the "Header image location" field
Click Submit

Header Structure Options #back to top

There are 3 header options to choose from.

Logo Only

Text Only

Logo and Text

Setting header structure - #back to top

Open FlightDeck Extension (Control Panel)
Set "Header Structure" option to either:
- Logo Only
- Text Only
- Logo and Text
Click Submit

Sidebar Settings

The sidebar is fixed at 300px wide

Enable the Sidebar - #back to top

Open FlightDeck Extension (Control Panel)
Set "Enable right Sidebar" to "Yes"
Click Submit

Edit Sidebar Content - #back to top

Open FlightDeck Extension (Control Panel)
Enter sidebar content in "Custom HTML code block #1" textarea.
Tip: HTML markup is supported.
Click Submit

Sidebar HTML Examples - #back to top

Content Box:

<div class="stats-block">
    <div class="inner">
        <ul class="topiclist">
            <li class="sidebar-header">
                <span class="fa fa-info-circle"></span>&nbsp;&nbsp;Block Title
            </li>
        </ul>             
        <ul class="topiclist forums">
            <li class="row">
                Box content
            </li>                                            
        </ul>
    </div>
</div>

125px x 125px Ad Grid:

<div class="sidebar-grid cf">
    <a href="#"><img src="./styles/milk/theme/images/sidebar/1.jpg" width="125" height="125" alt="" /></a>
    <a href="#"><img src="./styles/milk/theme/images/sidebar/2.jpg" width="125" height="125" alt="" /></a>
    <a href="#"><img src="./styles/milk/theme/images/sidebar/3.jpg" width="125" height="125" alt="" /></a>
    <a href="#"><img src="./styles/milk/theme/images/sidebar/4.jpg" width="125" height="125" alt="" /></a>
</div>

Social Bar Settings

Enable the Social Bar - #back to top

Open FlightDeck Extension (Control Panel)
Set "Enable Social Bar" to "Yes"
Click Submit

Adding Social Icons - #back to top

The Social Icons are powered by FontAwesome library.

Open FlightDeck Extension (Control Panel)

Enter Social Bar content in "Custom HTML code block #2" textarea, using the following format:

<a href="#"><span class="fa fa-twitter"></span></a>
<a href="#"><span class="fa fa-apple"></span></a>
<a href="#"><span class="fa fa-facebook"></span></a>
<a href="#"><span class="fa fa-codepen"></span></a>
<a href="#"><span class="fa fa-google"></span></a>
<a href="#"><span class="fa fa-digg"></span></a>
<a href="#"><span class="fa fa-pinterest-p"></span></a>

Refer to FontAwesome.com/icons/ for a full list of supported icons
Click Submit

Footer Content Settings #back to top

There are 2 footer content sections.

Editing Footer Content - #back to top

Open FlightDeck Extension (Control Panel)
Enter footer content in either of the following textareas:
- Bottom-left: Custom HTML code block #3
- Bottom-center: Custom HTML code block #4
Click Submit

Sample Code:

<h3>About Us</h3>
    <p><a href="http://www.planetstyles.net"><img src="./styles/milk/theme/images/horizontal-logo-transparent.png" height="50" /></a></p>
    <p>Hi! We're PlanetStyles, and we make premium forum themes for phpBB. Check out <a href="http://themeforest.net/user/PlanetStyles/portfolio?ref=PlanetStyles">our portfolio</a>, or visit <a href="http://www.planetstyles.net">our website</a> and say hi!</p>
    <p>This section can be replaced with anything you like!</p>

Sample Code:

<h3>Contact Us</h3>
    <ul class="fa-ul">
        <li><span class="fa fa-phone"></span> +44 0123-456-789</li>
        <li><span class="fa fa-map-marker"></span> Your address</li>
        <li><span class="fa fa-envelope"></span> your.email@yourdomain.com</li>
        <li><br /><span class="fa fa-twitter"></span> @twitter_handle
    </ul>

<br />

<p>You can enter any content here.</p>

Misc. Settings #back to top

Theme Accent Colour

Sets the default accent colour that will be shown to all end users.

Setting Theme Accent Colour - #back to top

Open FlightDeck Extension (Control Panel)
Use Colour Picker to choose colour. Note: If colour picker doesn't expend, ensure JavaScript is enabled and try purging phpBB's cache (ACP front page button).
Click Submit

Navbar Colour

Dark

Light

Transparent

Setting Navbar Colour - #back to top

Open FlightDeck Extension (Control Panel)
Set "Navbar Colour" option to either:
- Dark
- Light
- Transparent
Click Submit

Scroll to Top Button

Adds a "scroll to top" button in the lower-right corner on long pages.

Enabling Scroll to Top Button - #back to top

Open FlightDeck Extension (Control Panel)
Set "Enable Scroll to Top" option to either:
- Yes
- No
Click Submit

Collapsible Categories

Adds a switch to forum categories allowing the end user to show / hide specific categories as per their preferance. The user's choice is stored in their browser.

Enabling Collapsible Panels - #back to top

Open FlightDeck Extension (Control Panel)
Set "Enable Collapsible Panels" option to either:
- Yes
- No
Click Submit

Topic Creation Time on ViewForum

The Milk Theme hides the topic creation time on viewforum.php to declutter the space. This option allows you to return it.

Enabling Topic Creation Time on ViewForum - #back to top

Open FlightDeck Extension (Control Panel)
Set "topic creation time on viewforum" option to either:
- Yes
- No
Click Submit

Postprofile Side

'Postprofile' is the section of topic replies that contains the poster's avatar, post count and other poser-specific information. You can choose to display this information on the left or right side of the post.

Left

Right

Setting Postprofile side - #back to top

Open FlightDeck Extension (Control Panel)
Set "Postprofile Side" option to either:
- Left
- Right
Click Submit

User 'Joined' date on ViewTopic

The Milk Theme hides the user's joined date on viewtopic.php to declutter the space. This option allows you to return it.

Enabling Joined date on ViewTopic - #back to top

Open FlightDeck Extension (Control Panel)
Set "User 'Joined' date on viewtopic" option to either:
- Yes
- No
Click Submit

Help & Support #back to top

We provide help & support to all PlanetStyles Customers with an active support grant.

Please visit our Support Page or email missioncontrol@planetstyles.net

Support for our items includes:

* Responding to questions or problems regarding the item and its features
* Fixing bugs and reported issues
* Providing updates to ensure compatibility with new software versions

Regrettably can't freely assist with the following, however we do offer an affordable service for the following:

* Customisation and installation services
* Support for third party software and plug-ins

Please email us for a quote if you would like us to assist with Installation or Customisation.

Milk Theme for phpBB 3.1

Contents

How to Install Milk Theme #back to top

Setup Information

How to install the FlightDeck extension

Uploading the extension files

Enabling the extension

How to install the Milk Theme

Uploading the Theme Files

Enabling the Theme

Set Milk as default style

Configuring Theme Options #back to top

Logo settings #back to top

Uploading a logo - #back to top

Revert to the default logo - #back to top

Removing the logo - #back to top

Header settings #back to top

Uploading a header - #back to top

Header Size / Repeat / Position Options - #back to top

Revert to the default header (theme accent colour) - #back to top

Header Structure Options #back to top

Logo Only

Text Only

Logo and Text

Setting header structure - #back to top

Sidebar Settings

Enable the Sidebar - #back to top

Edit Sidebar Content - #back to top

Sidebar HTML Examples - #back to top

Content Box:

125px x 125px Ad Grid:

Social Bar Settings

Enable the Social Bar - #back to top

Adding Social Icons - #back to top

Footer Content Settings #back to top

Editing Footer Content - #back to top

Sample Code:

Sample Code:

Misc. Settings #back to top

Theme Accent Colour

Setting Theme Accent Colour - #back to top

Navbar Colour

Setting Navbar Colour - #back to top

Scroll to Top Button

Enabling Scroll to Top Button - #back to top

Collapsible Categories

Enabling Collapsible Panels - #back to top

Topic Creation Time on ViewForum

Enabling Topic Creation Time on ViewForum - #back to top

Postprofile Side

Setting Postprofile side - #back to top

User 'Joined' date on ViewTopic

Enabling Joined date on ViewTopic - #back to top

Help & Support #back to top

Version History (Changelog) #back to top

Changelog